<template>
  <div>
    <top-swiper :topNine="topNine"></top-swiper>
    <card v-for="book in books" :key="book.id" :book="book"></card>
    <p class='text-footer' v-if='!more'>
      没有更多数据
    </p>
  </div>
</template>
<script>
import { get } from '@/util'
import Card from '@/components/Card'
import TopSwiper from '@/components/TopSwiper'
export default {
  data () {
    return {
      books: [],
      page: 0,
      more: true,
      topNine: []
    }
  },
  components: {
    Card,
    TopSwiper
  },
  methods: {
    async getBooksList (init) {
      if (init) {
        this.page = 0
        this.more = true
      }
      wx.showNavigationBarLoading()
      const res = await get('/weapp/booklist', {
        page: this.page
      })
      if (res.books.length < 10 && this.page > 0) {
        this.more = false
      }
      if (init) {
        this.books = res.books
        wx.stopPullDownRefresh()
      } else {
        this.books = this.books.concat(res.books)
      }
      wx.hideNavigationBarLoading()
    },
    async getTopNine () {
      const res = await get('/weapp/topcount')
      this.topNine = res.topnine
    }
  },
  created () {
    this.getBooksList(true)
    this.getTopNine()
  },
  onShow () {
    if (wx.getStorageSync('isViewd')) {
      this.getBooksList(true)
      this.getTopNine()
    }
  },
  onHide () {
    wx.setStorageSync('isViewd', false)
  },
  onPullDownRefresh () {
    this.getBooksList(true)
    this.getTopNine()
  },
  onReachBottom () {
    if (!this.more) {
      // 没有更多了
      return false
    }
    this.page = this.page + 1
    this.getBooksList()
  }
}
</script>
<style>
</style>
